import React, { Component } from 'react'
import {NavLink} from 'react-router-dom'

import {connect} from 'react-redux'

class Footer extends Component {
  render() {
    return (
        <footer className='footer'>
        <NavLink to={'/home'}>
          <span className='iconfont icon-shouye'></span>
          <p>首页</p>
        </NavLink>
        <NavLink to={'/kind'}>
        <span className='iconfont icon-fenlei'></span>
          <p>分类</p>
        </NavLink>


        {
          this.props.loginState ? 
          (<NavLink to={'/cart'}>
          <span className='iconfont icon-gouwuche'></span>
            <p>购物车</p>
          </NavLink>) : 
          (<NavLink to={'/login'}>
          <span className='iconfont icon-gouwuche'></span>
            <p>未登录</p>
          </NavLink>)
        }
        

        
        <NavLink to={'/user'}>
        <span className='iconfont icon-My'></span>
          <p>我的</p>
        </NavLink>
      </footer>
    )
  }
}

export default connect((state)=>{
  return {
    loginState: state.getIn(['user','loginState'])
  }
},null)(Footer)